<template>
    <el-container class="full">
        <!-- 侧边 -->
        <el-aside width="160px">
            <side-bar>
                <!-- <div slot="trademark" class="title-box">
                    <span>管理后台</span>
                </div> -->
                <div slot="router">
                    <component v-for="item in menuList" :key="item.name" :data="item" :is="item.children?'sub-menu':'menu-item'" />
                </div>
            </side-bar>
        </el-aside>
        
        <el-container class="full-height bg-gray">
            <!-- 头部 -->
            <el-header class="no-padding header" style="padding: 0;height: auto;background: #fff;">
                <top-bar />
            </el-header>
            <v-tags></v-tags>
            <!-- 主体 -->
            <div class="main" :class='isMargin?"no-margin":""'>
                <transition name="move" mode="out-in">
                    <router-view />
                </transition>
            </div>   
        </el-container>
    </el-container>
</template>
<script>
    /* eslint-disable space-infix-ops */
	import PermissionMapper from '../configs/permission-mapper';
	import router from '../router/index'
    import TopBar from '../components/TopBar';
    import SideBar from '../components/side-bar';
    import MenuItem from '../components/side-bar/menu-item'
    import SubMenu from '../components/side-bar/sub-menu'
    import vTags from '@/components/TagsView/Tags.vue';
    // import { pms2MenuList,decrypt} from '../filters/filter'
    import bus from '@/jslibs/bus';
	import Utils from '@/jslibs/utils'
    export default {
        name: 'Index',
        data() {
            return {
                isMargin:false,
                permissionList: [],
                menuList: [],
                tagsList:[]
            };
        },
        components: {
            TopBar,
            SideBar,
            MenuItem,
            SubMenu,
            vTags
        },
            
        created() {
            // const encryptedPermission = sessionStorage.getItem('permission')
            // 解码并转换成对象格式
            // this.permissionList = JSON.parse(decrypt(encryptedPermission));
        },
		
        mounted() {
			// console.log(this.$route,this.$router,"5555")
			// console.log(router,"6666")
			// console.log(PermissionMapper,"7777")
			// const menuList = router.options.routes[2].children;
			const role = Utils.getSession('role');
			const schoolArr = JSON.parse(JSON.stringify(PermissionMapper));
			if(role != 0){
				schoolArr.shift()
			}
            this.menuList = schoolArr;
        },
		
        methods: {
            event() {
                return {
                    onClick() {},
                };
            },

            network() {
                return {
                    getListA() {

                    },
                };
            },
        },
        // watch: {
        //     $route(to,from){
        //         if(to.path == "/equipment-detail"){
        //             this.isMargin = true;
        //         }
        //         else{
        //             this.isMargin = false;
        //         }
        //     }
        // },
    };
</script>

<style lang="less" scoped>
    .title-box {
        font-size: 18px;
        color: #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 10px;
    }

    .full-height {
        height: 100vh;
        overflow: hidden;
        background: #f0f0f0;
    }

    .main {
        padding: 20px 20px 30px 20px;
        overflow-y: auto;
        background: #fff;
    }
    .no-margin{
        padding-top: 0 !important;
    }
    
    .fade-enter-active, .fade-leave-active {
      transition: opacity .5s;
    }
    .fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
      opacity: 0;
    }
</style>
